<template>
	<view>
		<cu-custom bgColor="bg-red" :isBack="true">		<block slot="backText"></block>
			<block slot="content">渠道升级</block>
		</cu-custom>
		<view class="bg-white overflow">
			<view class="bg-blue margin-lr margin-top padding-sm radius" style="background-image:url('https://gsconline-1251028293.cos.ap-guangzhou.myqcloud.com/static/attract/levelbg.png'); background-repeat: no-repeat; background-size: 100%;">
				<view class="text-white">当前级别</view>
				<view class="text-white text-lg margin-top-xs">{{member?member.level.name:'-'}}</view>
				<!-- <view class="text-white margin-top-xs">成为时间：</view> -->
			</view>
		</view>
		<scroll-view scroll-x class="bg-white nav text-center">
			<view class="cu-item" v-for="(item,index) in level_list" :key="index" v-if="item.level > 1" :class="index==TabCur?'cur text-'+theme:'text-gray'"
			 @tap="tabSelect" :data-id="index">
				{{item.name}}
			</view>
		</scroll-view>
		<view v-for="(item,index) in level_list" :key="index" v-if="item.level > 1">
			<block v-if="index==TabCur">
				<view class=" padding bg-white margin">
					<view class="bgline text-center margin-bottom text-lg">用户权益</view>
					<!-- <rich-text :nodes="item.detail"></rich-text> -->
					<mp-html :content="item.detail"></mp-html>
				</view>
			</block>
			<block v-if="index==TabCur">
				<view class="cu-bar foot bg-gray text-center justify-center" v-if="member && member.current_level >= item.level">已升级</view>
				<block v-else>
					<view class="cu-bar foot bg-gray text-center justify-center" v-if="log && log.up_level == item.id && log.examine_status == 0">审核中</view>
					<block v-else>
						<view class="cu-bar foot bg-gray text-center justify-center" v-if="log && log.up_level == item.id && log.examine_status == 0">审核中</view>
						<view class="cu-bar foot bg-blue text-center justify-center" v-else-if="log && log.up_level == item.id && log.examine_status == 2">
							<view @tap="goExpect(item.level)">
								<view>重新申请</view>
								<view class="text-sm text-gray">驳回：{{log.reason}}</view>
							</view>
						</view>
						<view class="cu-bar foot bg-blue text-center justify-center" v-else @tap="goExpect(item.level)">申请升级</view>
					</block>
				</block>
			</block>
		</view>
		<Foot :value="''"></Foot>
	</view>
</template>

<script>
	import Foot from '@/components/default/foot.vue';
	import mpHtml from '@/components/mp-html/mp-html.vue';
	export default {
		components: {Foot,mpHtml},
		data() {
			return {
				theme: this.$config.THEME(),
				TabCur: 0,
				member: null,
				level_list: null,
				log: null,
				level_count: 0,
			};
		},
		onLoad(options) {
			if (this.$common.loginAuth(true)) {
				this.getLevelInfo()
			}
		},
		onShow() {
			if (this.$common.loginAuth(true)) {}
		},
		methods: {
			tabSelect(e) {
				if (this.TabCur != e.currentTarget.dataset.id) {
					this.TabCur = e.currentTarget.dataset.id
				}
			},
			getLevelInfo() {
				uni.showLoading({
					title: '加载中...'
				})
				this.$http
					.get('level_info')
					.then((response) => {
						this.member = response.data.data.member
						this.level_list = response.data.data.level_list
						this.log = response.data.data.log
						this.level_count = this.level_list.length
						if (this.member.current_level == this.level_list.length) {
							this.TabCur = this.level_list.length - 1
						} else this.TabCur = parseInt(this.member.current_level)
						uni.hideLoading()
					})
					.catch((response) => {
						console.log(response)
					})
			},
			goExpect(up_level) {
				uni.showLoading({
					title: '加载中...'
				})
				let _this = this
				this.$http
					.post('level_up', {
						up_level: up_level
					})
					.then((response) => {
						console.log(response)
						uni.hideLoading()
						this.$common.showSuccess('申请成功', function() {
							_this.getLevelInfo()
						})
					})
					.catch((response) => {
						uni.hideLoading()
						console.log(response)
					})
			},
		},
	}
</script>

<style>
</style>
